<!--  -->
<template>
<div class="">
    <a-card :bordered="false">
        <f-search-form>
            <f-search-form-item label="项目代码" name="userName" />
            <f-search-form-item label="项目名称" name="account" />
            <f-search-form-item label="供应商编码" name="provider" />
            <f-search-form-item label="专业包代码" name="mobile" slot="advanced" />
            <f-search-form-item label="专业包名称" name="rangeDate" slot="advanced" />
            <f-search-form-item label="工程包代码" name="rangeDate" slot="advanced" />
            <f-search-form-item label="工程包名称" name="rangeDate" slot="advanced" />
        </f-search-form>

        <f-table ref="table" size="default" :columns="columns" :dataSource="datasource">
            <span slot="action" slot-scope="text, record">
                <template>
                    <a @click="$refs.modal.handleShow(record)">下载月报</a>
                    <a-divider type="vertical" />
                </template>
                <template>
                    <a @click="$refs.cat.handleShow(record)">查看月报</a>
                    <a-divider type="vertical" />
                </template>
                <template>
                    <a @click="$refs.fillIn.handleShow(record)">填报</a>
                    <a-divider type="vertical" />
                </template>
            </span>
        </f-table>
        <cat-report ref="cat"></cat-report>
        <fillIn-page ref="fillIn"></fillIn-page>
    </a-card>
</div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

import CatReport from './catreport'
import FillInPage from './fillInPage'

export default {
    //import引入的组件需要注入到对象中才能使用
    name: 'list',
    components: {
        CatReport,
        FillInPage,
    },
    props: {},
    //import引入的组件需要注入到对象中才能使用
    data() {
        //这里存放数据
        return {
            columns: [{
                    title: '项目代码',
                    align: 'center',
                    dataIndex: 'projectcode',
                },
                {
                    title: '项目名称',
                    align: 'center',
                    dataIndex: 'name',
                },
                {
                    title: '工程包代码',
                    align: 'center',
                    dataIndex: 'packagecode',
                },
                {
                    title: '工程包名称',
                    align: 'center',
                    dataIndex: 'packagename',
                },
                {
                    title: '专业代码',
                    align: 'center',
                    dataIndex: 'majorcode',
                },
                {
                    title: '专业名称',
                    align: 'center',
                    dataIndex: 'majorname',
                },
                {
                    title: '项目当前版本',
                    align: 'center',
                    dataIndex: 'version',
                },
                {
                    title: '最后一次版本提交时间',
                    align: 'center',
                    dataIndex: 'endCommitTime',
                },
                {
                    title: '操作',
                    align: 'center',
                    dataIndex: 'action',
                    width: '230px',
                    scopedSlots: {
                        customRender: 'action',
                    },
                },
            ],
            datasource: [{
                    projectcode: '7ds9',
                    name: '谷粒商城',
                    packagename: 'gulimall',
                    majorname: '谷粒商城',
                    version: '1.0',
                    endCommitTime: '2020-10-24 8:56',
                },
                {
                    projectcode: '8djw9',
                    name: 'JBOA办公自动化管理系统',
                    packagename: 'jboa',
                    majorname: 'JBOA办公自动化管理系统',
                    version: '1.5',
                    endCommitTime: '2020-10-24 2:33',
                },
                {
                    projectcode: 'i9sdw',
                    name: '易买网',
                    packagename: 'easybuy',
                    majorname: '易买网商城平台',
                    version: '2.0',
                    endCommitTime: '2020-10-24 4:43',
                },
                {
                    projectcode: 'wf3jw',
                    name: 'KTV点歌系统',
                    packagename: 'ktv',
                    majorname: 'KTV自动点歌系统',
                    version: '4.3',
                    endCommitTime: '2020-10-22 5:13',
                },
                {
                    projectcode: 'dsjs8w',
                    name: '超市订单管理系统',
                    packagename: 'bdqn',
                    majorname: '超市订单管理系统',
                    version: '2.3',
                    endCommitTime: '2020-10-22 1:44',
                },
            ],
        }
    },
    //监听属性 类似于data概念
    computed: {},
    //监控data中的数据变化
    watch: {},
    //方法集合
    methods: {},
    //生命周期 - 创建完成（可以访问当前this实例）
    created() {},
    //生命周期 - 挂载完成（可以访问DOM元素）
    mounted() {},
    beforeCreate() {}, //生命周期 - 创建之前
    beforeMount() {}, //生命周期 - 挂载之前
    beforeUpdate() {}, //生命周期 - 更新之前
    updated() {}, //生命周期 - 更新之后
    beforeDestroy() {}, //生命周期 - 销毁之前
    destroyed() {}, //生命周期 - 销毁完成
    activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang="scss" scoped>
//@import url(); 引入公共css类
</style>
